<template>
  <div>
    <el-descriptions title="订单信息" style="background-color: pink">
      <el-descriptions-item label="订单号">{{
        myOrder.id
      }}</el-descriptions-item>

    <el-descriptions-item label="产品名字">
      {{myOrder.name}}
    </el-descriptions-item>

      <el-descriptions-item label="付款账号">{{
        myOrder.account
      }}</el-descriptions-item>

      <el-descriptions-item label="存入金额">{{
        myOrder.principal
      }}</el-descriptions-item>

      <el-descriptions-item label="存期(月)">{{
        myOrder.term
      }}</el-descriptions-item>

      <el-descriptions-item label="年利率">{{
        myOrder.annualProfitRate
      }}</el-descriptions-item>

      <el-descriptions-item label="起息时间"
        >{{ myOrder.startDate }}
      </el-descriptions-item>

      <el-descriptions-item label="到期时间"
        >{{ myOrder.endDate }}
      </el-descriptions-item>

      <el-descriptions-item label="预期收益">{{
        myOrder.interest
      }}</el-descriptions-item>

    </el-descriptions>

    <el-button type="danger" style="float: right; width: 15%" @click="onCopl"
      >存入</el-button>
  </div>
</template>

<script>
import { saveOrder } from '@/api/order'
import { purchase } from "@/api/purchase";
import { getProduct } from '@/api/product'

export default {
  name: "OrderInfo",
  data() {
    return {
      myOrder: {
        id: '',
        account: '',
        name: '',
        principal: 0,
        term: 0,
        annualProfitRate: 0,
        startDate: null,
        endDate: null,
        interest: 0
      },
      myMap: {
        areaIsOk: "您所在区域不支持购买该产品",
        labelIsOk: "您被限制购买该产品",
        isLogin: "请登陆后购买",
        productAllowanceReduceIsOk: "该产品库存不足",
      },
      actualOrder: {
        id: '',
        name: '',
        account: '',
        productId: '',
        startDate: null,
        endDate: null,
        principal: 0,
        interest: 0,
        annualProfitRate: 0,
        term: 0
      }
    };
  },
  created() {
    this.myOrder.principal = this.$store.state.pmin;
    this.myOrder.account = this.$store.getters.getAccount;
    this.myOrder.id = "xx"+Date.now();
    let obj = {};
    obj.userId = this.$store.state.uid;
    obj.productId = this.$store.state.pid;
    obj.token = sessionStorage.getItem("token");
    obj.principal = this.myOrder.principal;
    this.verification(obj);
    this.productInfo(this.$store.state.pid)
  },
  methods: {
    onCopl() {
      //对象拷贝
      const source = this.myOrder;
      const target = this.actualOrder;
      Object.keys(target).forEach(key => {
        target[key] = source[key];
      })
      target.productId = this.$store.state.pid;
      saveOrder(target).then(res => {
        if(res.data) {
          this.$router.push('/ordercompleted');;
        }
        else{
          this.$message.warning("网络异常，请稍后重试");
          this.$router.push('/list');
        }
      })
    },
    verification(obj) {
      purchase(obj).then((res) => {
        const data = res.data;
        this.myOrder.startDate = data.startDate;
        this.myOrder.endDate = data.endDate;
        this.myOrder.interest = data.interest;
        const o = this.myMap
        for (const key in o) {
          if (Object.hasOwnProperty.call(o, key)) {
            if(data[key] === null || data[key]) {
              continue;
            }else{
              this.$message.warning(o[key]);
              this.$router.push("/list");
              return;
            }
          }
        }
      });
    },
    productInfo(id) {
      getProduct(id).then(res => {
        let r = res.data;
        this.myOrder.term = r.term;
        this.myOrder.annualProfitRate = r.annualProfitRate;
        this.myOrder.name = r.name;
      })
    }
  },
};
</script>

<style>
</style>